<p><p>    <!DOCTYPE html>
    <html>
      <head>
    <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!--///////////////////////////////////////////////////////////////////////////////////////////////////
        //
        //		Styles
        //
        ///////////////////////////////////////////////////////////////////////////////////////////////////--> 
        <link rel='stylesheet' id='camera-css'  href='css/camera.css' type='text/css' media='all'> 
        
    
    
    <title>jQuery Mobile Web App</title>
    <link href="css/maokong.css" rel="stylesheet" type="text/css"/>
      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
    
      <link rel="stylesheet"  href="css/jquery.mobile.structure.css" />
      <link rel="stylesheet" href="css/jquery.mobile.theme.css" />
      
      <script>
        var userAgent = navigator.userAgent + '';
        if (userAgent.indexOf('iPhone') > -1) {
          document.write('<script src="js/lib/cordova-iphone.js"></sc' + 'ript>');
          var mobile_system = 'iphone';
        } else if (userAgent.indexOf('Android') > -1) {
            document.write('<script src="js/lib/cordova-2.0.0.js"></sc' + 'ript>');
          var mobile_system = 'android';
        } else {
          var mobile_system = '';
        }
      </script>
      <script src="js/lib/jquery.js"></script>
      <!-- your scripts here -->
      <script src="js/app/app.js"></script>
      <script src="js/app/bootstrap.js"></script>
      <script src="js/lib/jquery.mobile.js"></script>
       <script type='text/javascript' src='scripts/camera.min.js'></script> 
      <script src="js/jquery.easing.1.3.js"></script>
        <script>
               function onDeviceReady() {
            console.log("We got device ready");
            cordova.exec(null, null, "SplashScreen", "hide", []);
         	        }

        
            // Soon to beonDeviceReady
            // navigator.splashscreen.hide();
        </script>
        <script>
            jQuery(function(){
                
                jQuery('#camera_wrap_2').camera({
                    height: '400px',
                    loader: 'bar',
                    pagination: false,
                    thumbnails: true
                });
            });
 
            	function orientationChange(e) {
            	 var orientation="portrait";
            	 if(window.orientation == -90 || window.orientation == 90) orientation = "landscape";
            	 alert(orientation);
            	}
                document.addEventListener("deviceready", onDeviceReady, false);
                window.addEventListener('load', setOrientation, false);
                // listening orientationchange event
                window.addEventListener('orientationchange', setOrientation, false);  
                 
                // 判斷螢幕旋轉方向
                function setOrientation() {
                    var orient;
                     
                    if (window.orientation) { 
                        orient = Math.abs(window.orientation) === 90 ? 'landscape' : 'portrait';
                    }
                    else if (window.screen) {
                        var width = screen.width;
                        var height = screen.height;
                        orient = (width > height) ? 'landscape' : 'portrait';
                    }
                    else {
                        orient = 'unknow';
                    }
                     
                    alert(orient); 
                }
            </script>                           
    
    </head>
      <body>
    
    <div data-role="page" data-add-back-btn="true" data-back-btn-text="上一頁"
    data-back-btn-theme="e" id="page4">
        <div data-role="content">
            <div class="camera_wrap camera_magenta_skin" id="camera_wrap_2">
                <div data-thumb="images/mou_1_2.jpg" data-src="images/mou_1_1.jpg">
                    <div class="camera_caption fadeFromBottom">
                        <em>貓空大優惠</em> 買一送一
                    </div>
                </div>
                <div data-thumb="images/mou_2_2.jpg" data-src="images/mou_2_1.jpg">
                    <div class="camera_caption fadeFromBottom">
                        <em>貓空大優惠</em> 買一送一
                    </div>
                </div>
                <div data-thumb="images/mou_3_2.jpg" data-src="images/mou_3_1.jpg">
                    <div class="camera_caption fadeFromBottom">
                        <em>貓空大優惠</em> 買一送一
                    </div>
                </div>
            </div><!-- #camera_wrap_2 -->
        </div><!-- .fluid_container -->
              <div class="contentbody"><a href="store.html" rel="external">
                  <img style="width:25%" src="images/around.png"/></a> </div>
              <div class="contentbody"> <a href="store.html" rel="external">
                  <img style="width:25%" src="images/bonus.png"/></a> </div>
        
      </div>
  
    
    </body>
      </html>
</p></p>